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Abstract 


The population of Pakistan is increasing rapidly and so is the ratio of blood 
borne conditions—and diseases. To further aggravate the situation, the 
furthermost alarming threat is the fact that the ratio of blood donors in 
Pakistan is just less than 10% of the whole population. This is clearly 
insufficient to meet the high rising medical demands of the blood in 
emergency situations. In majority cases, the cause of patient demise in 
Pakistan is merely due to the sole reason that the blood donor cannot 
communicate with the recipients properly from any platform. The aim of 
this research project is to create awareness and motivation for people 
through a “Cost Free” blood donation application to donate the blood on 
just one click. The blood bank tab will provide the perfect path to find a 
potential person willing for the donation. By using maps, everyone can trace 
the blood banks according to the required need. Likewise, the recipients and 
the donors can be accessed from the application to find the nearest blood 
banks and the hospitals via using search bar. This application specifically 
targets age group ranging from 20 to 50 years; and encourages youth to 
participate in blood donation. This app enables individuals as well as larger 
organizations to create profile so that the community may benefit from 
donors. All blood banks and the hospitals can join the application for best 
services. This prototype app will be designed and developed according to 
the required needs; and will be presented through advertising techniques 
that includes: branding, poster, standees, billboards and an installation for 
understanding. 


Index Terms: android app, blood donation, blood bank, prototype 
design, tracking donors, vector-art style. 
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I. Introduction 


The rapid increase in Industrialization has led 21“ century to the digital 
era where the foremost choice of youth is to opt mobile operating system 
and different phone apps. Android mobile system is a step further that 
enables its users to find anything according to the need [1]. The need to 
develop a blood donation app is to facilitate blood donation in Pakistan as 
the blood donation rate is very low [2]. According to the current statistics, 
the number of donors is insufficient to cover the whole population of blood 
receptors in Pakistan. With the passage of time, the rate of blood donation 
in Pakistan is growing on a very slow rate because the blood donors do not 
have a proper platform to donate the blood or spread the information. 
Moreover, most people in this region are not aware about the importance of 
blood donation. On June 14", people celebrate the Blood Donation Day 
worldwide; and donate the blood in abundance in order to store into blood 
banks for the emergency situations [3]. 


Unfortunately, in rural areas of Pakistan, it has been reported that some 
of the blood banks do not check the screen test (like HIV, Hepatitis A, B 
and C and AIDS) of the donor before the blood collection. Such blood banks 
are initiated merely as a business to gain profit at the expense of human 
lives. As indicated by the Punjab Blood Transfusion Authority (PBTA 
2006), that various blood banks operating in Pakistan are unregistered. 
According to this report, only 34 out of 500 blood banks in Punjab are 
registered and have license. In addition, nearly 72% hospitals in rural and 
urban areas of Pakistan does not have the blood transfusion committees, due 
to which the unscreened blood banks are operating widely and hence 
preying on patients’ lives. This is, in turn, contributes to be one of the 
biggest causes of spreading viral diseases like HIV, Hepatitis B, C and 
AIDS in the country [4]. 


A. Historical Background 


In 1492, the first attempt of blood transfusion was tried by the 
physicians for a girl named Pope. Unfortunately, this attempt became futile 
as the girl couldn’t survive. After that various attempts were made during 
1818s. A British man, James Blundell, took the risk of blood transfusion for 
his mother upon the delivery of her newborn. The doctor transferred the 
blood via injection and it became the first ever successful attempt. In 1900, 
the Australian scientist, Karl Landsteiner, discovered astounding human 


School of Design and Textiles Fon 
Volume | Issue 2, Fall 2022 Ba 


UMT—_-53 


Prototype Design and Development... 


blood groups and identified three main categories A, B and O. Mr. Karl got 
the noble prize for that study in 1930s. In 1935, the American founded the 
International Society of Blood Transfusion (ISBT) and stored first blood 
bottle in 1936. The practice of blood transfusion continued successfully 
through the years, but later during the year 1981, the American doctors 
found first AIDS patient. After that the American Medical Unit 
implemented a law for the blood donors to pass the AIDS and HIV test 
before undergoing through blood donation/transfusion [5]. 


B. Contribution 


We have based our application on International standards, keeping it 
simple and easy to use. Innovative ideas have been collected for elements, 
color scheme and the campaign of the application project. Initially we made 
the sketches of the user’s experience for the application project. 


These steps were followed for the completion of the project: 


e The collection of the relevant information/data for the project. 

e The most suitable software usage, for example, Adobe Photoshop, 
Adobe XD, and Adobe Illustrator to design using various techniques. 

e The designing of the print media products has been created to advertise 
the project. 


C. Project Objectives 


In order to obtain the designed phone application, the donor will 
download the application from Google Play Store and the install into their 
smart phones [6]. Both the donor and the receiver will register with the 
application through the app path. By enabling this application, the donors 
are will be available 24/7 and receptors can contact the donors according to 
their needs. 


The chief motive to design this application is to increase the number of 
the blood donators; and to create and maintain the data base that can be 
accessible according to the rising transfusion requirements in our country. 
Here is the plan to understand the application path. 
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Application Plan 


Splash Screens Signup/Register 


If you are already a 
member, then click on 
the Sign-In Button. 


; Navigation/ 


Donor Detail 


Donors History 


Any donor who 


In an emergency 
case, user can post 
the request and the 
request will be 
shown in the 
request panel 
automatically to 


donors 


If in case the 
donors are not 
available in your 


area you can 
contact with 
registered blood 


donates the blood 
will be 


automatically added 
in the donor history 
list and can be 
released after “3” 


banks in our App. 


months. 


Fig. 1. Application plan of the designed app 
II. Literature Review 


In Pakistan, several organizations like NGO (Non-Governmental 
Organization) or BDO (Blood Donation Organization) are playing a 
significant role in blood donation in order to build a responsible community. 
Since 1978, these organizations are working as a fundamental component 
in Pakistan. Despite their significant role they had not been able to provide 
a platform to join or engaged the public for blood donation [7]. 


In addition, few independent NGOs/BDOs are providing social services 
in Pakistan. Following are few examples. 


A, Aman Blood Organization 


Mr. Rashid has established Aman Blood Organization (ABO) in 2006, 
to provide the services of blood donation to humanity. They are working as 
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an independent unit. They are working as a complete team; and find ways 
to engage the volunteers without the aid of electronic media [8]. 


B. Call for Rise Blood Donation Society 


Mr. Mohisn Magbool established this organization in 2008. It’s 
registered in the blood welfare society with the Registration Act 1860. The 
organization has a very professional staff with president and a volunteer 
team that mostly works with the Shokat Khanam Hospital. 


C. Sundas Foundation 


Sundas Foundation is founded in 1998 in Gujranwala, Pakistan. The 
foundation was built to obtain healthy blood from volunteers. The aim of 
the foundation is to protect the poor’s and under privileged Haemophelia 
patients; and children suffering from Lukemia, Thalassemia etc. [9]. 


D. Pakistan Red Crescent 


The Red Crescent Blood Transfusion Service (BTS) build the 
community for the blood donation purposes; and try to produce a cost-free 
blood for the poor. It is registered under GOP. 


III. Methodology 
A. Overview 


The method of the design is very important in the whole project. The 
current discussion will be on a brief overview, conceptual frameworks, 
historical research, design techniques, prototype, methods of research, 
design mood etc. The visual concept and the sketches will give the idea of 
final display solutions of the project. 


B. Conceptual Framework 


The concept of the project is to help people suffering from blood borne 
diseases; and to create awareness regarding blood donation. The framework 
is based on the android application that will create a platform which 
connects the public to meet the needs of blood donation. With this 
application, the needed person could find the location of donor through 
google map; and they can directly communicate with each other. 
Meanwhile, the awareness will be created through posters and other 
promotional things. 

The poster designs with quotations acts as a catalyst to promote public 
interaction and make them aware regarding the importance of blood 
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donations. As mentioned in the previous sections, that there were no designs 
or campaigns to cover this domain. The Shaukat Khanum Hospital for the 
first time carried out the campaign about blood donation; and the team 
spreads the awareness to people by providing door-to-door facility with the 
help of flyers but the designs were average. 


C. Posters References 


ManipalHospitals 


ute 


Everything You Wanted To Know About 


DONATING BLOOD 


i 

| GIVE 
PUOTTLE 

ie 
| 


Join Us 

Blood Donation) » o-=« 

OCC Head Office, Atkbmelre” fee | Fam-tem 
ey 


Zs 
Sewmemsn gn senen 
: 


Fig. 3 (a & b). Poster design to promote blood donation activity on the 
bases of outdoor and indoor activities. 
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DO YOU GET 


THE NEED IS CONSTANT ys BLOOD? 


THE GRATIFICATION IS INSTANT SOM E G ET 
bea DONATE : SCARED 


WHEN THEY 
DON’T 


DONATE BLOOD. DONATE LIFE. 


' 


Y\ 5 | 


Fig. 4 (a& b). Applications 


Give? Te0g 


A gift straight from your heart. 


Fig. 5 (a & b). Posters 
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Fig. 7. Application prototype II 
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? . Q POST BLOOD REQUEST 
FILL UP THE FORM BELOW TO POST 


REQUEST 
ADD DONOR BLOOD DONORS 
FULL NAME 
DONATE BLOOD = e 
OR ADD BLOOD REQUEST BLOOD REQUESTS MOBILE NUMBER 
FIND BLOOD DONOR = 
oP SELECT BLOOD GROUP 
REMINDER BLOOD BANKS & 
< R NUMBER OF BLOOD UNIT 


SHARE APP. CONTACT US CITY 


BLOOD BANK PAKISTAN ’ 


Fig. 8. Application prototype III 


Blood Bank Application 


Registers all the donors and then show all the available donor in particular Area 


BLOOD BANK BLOOD BANK BLOOD BANK 


6 Mayank Jain 
Indore, Airport Road 
Sameer Jain 
Indore, MOG Lines Name 
Mayank Jain 
Arvind Blood Group 
JUST UKE JOUR PARENTS Sato Indore, Airport Road Group AB+ 
Ev44y PROP OF Sane coum 
Address 
Shubham Soni 112, Sukhdev Vihar 
Indore, Gandhi Nagar Airport Road, Indore 
Indore, Hi-link city 


Developed By Tilak Samal 


Fig. 9. Application prototype IV 
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Very few blood donation applications are working donation as digitally, 
but they are unattractive and not user-friendly designs due to which the 
users abandon the app. 


D. Prototype 


The process of designing the prototype started from the sketches; and 
afterwards the application for the UI (User Interface) was developed. When 
the the user click on the app icon, it starts with the splash. On the main 
screen, registeration shows up where the user can create the profile and 
login. Then the navigation will provide the exact path to the user that 
enables him/her to find blood donors or receptors. 


1) Application Sketch Prototype 


The UX pattern is used to check the application prototype its relation 
between the screens Following sketches of the UX pattern shows the details 
of our application prototype. 


Fig. 10 (a,b and c). Sketch prototype 
2) Research Board 


Through the research board, we obtained different ideas and creative 
designs: including, vector poster, 2D shape posters, user interfaces; and to 
understand the category of graphics that I will incorporate in this project. 


My theme is based mostly on social issues and taboos due to people 
hesitate or refrain to donate blood. In addition, I opted for a rythmetical 
layout for the posters [10]. 
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DONATE BLOOD 
BUT NOT ON THE 


ROAD! 


Fig. 11. Research Board 
3) Mood Board 


In our research project, we have used red, white, black and grey tones 
as our color schemes. This will enhance the blood donation art in the posters 
layout and the application. The typography was created according to the 
mood that emphasized on the public interaction; and understanding the 
graphical message in the poster. Following are some mood board images. 


GET A FREE T-SHIRT 
www.redcross.org/donate/give 


Leattheraveneoa3aveeveryone 


Sum DONATION 
Fig. 12 (a & b). Mood board 
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4) Design Techniques 


In this project, we are using the vector illusrtation art work we made the 
sketches and designed the structures of the poster; made some UX designs 
sketches for the application. After the innitial process, we chose the 
softwares like Adobe Photoshop, Adobe Illustrator and Adobe XD to 
develop these sketches digitally and for printing. The design elements and 
the principles were used to make the final shape of app design [11]. In order 
to create the vector and the persons illustration in the posters, mostly the 
pen tool, selection tools, text tools and the color penal tools were used. 


IV. Results / Executions 


Adobe Photoshop and Adobe Illustrator is used while creating the whole 
project designs. In production, the most difficult thing is to manage the 
layout style with using the images, vectors, colors, text, symbols etc. 
Through the visual research method, the medium was selected for the 
procedure of the work scenario. During the project, we build a clearer 
concept through visual research; and research may be subject to change 
according to the project situation. The visual research, enables us to realize 
many existing concepts that are related to our topic. This provided us with 
the perfect and innovative ideas to be used in the project; and to accomplish 
it through varying colors, and objects. 


We created the sketches of the ideas and then converted them digitally; 
and for printing solutions, we choose the Adobe Photoshop & Illustrator 
software. Finally, I drew the modified sketches and scanned them digitally 
with the help of Adobe Photoshop and Illustrator. 


A. Philosophy Behind the App Design 


The idea behind this research is purely based on philanthropic 
motivation to structure a campaign of blood transfusion importance and 
awareness. 


B. Layout Samples 


Layouts are a very important part of the design. Numerous sketches 
were created rigorously and continued until the best layout for the poster 
design or in the vector illustration were selected. Following are some layout 
samples from the initial stages that were later modified into more clear and 
appealing form. 
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I) Development Effects 


After the complete research and fulfill the sketch base ideas to move to 
the final creation to develop the design with the help of the mood board. 
The sketches and the mood board research methods, all explained the 
complete story of the idea concept. The poster and the installation perfectly 
explained through the posters because every poster has a social message. 
The final output of the posters and the application styles shows the 
purpose/message of the project clearly. 


The inspirational images got from the research, I get the color scheme 
and illustrations ideas. The idea and the concept thought by the social 
circumstances because people usually don’t accept this kind of the project 
in awareness point of view to the effect it will be created to the inspiration 
to the public to encourage to donate the blood. After the completion of all 
data collection then design the poster according to the selected theme. 


2) Color Theme 


According to the topic, ‘Blood Donation’, the color scheme plays a vital 
role in creating the design using the vector art style. We selected the 
combination of 3 colors (Red, Blackish-Grey and White) for the entire 
project. whereas, the red color is symbolic representation of blood in our 
particular project. On the contrary, 90% of the world uses red color as it 
represents emotions such as love, anger, happiness, sacrifice, passion, 
activity, joy, etc. While, the White color signifies purity and cleanliness in 
the designs. The grey color is mostly used for sadness, depression, 
loneliness, communication, etc. The black color is one of the richest colors 
in all palettes, so we use a little bit in the whole project to give a contrast 
between positive and negative aura circulating around blood. 


Fig. 13 (a & b). Color theme 
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IV. Final Designs 


& 


DONATE 


BLOOD DRIVE 


VOLUNTEERS WEEDE 


1 PINT GAN SAVE 3 LIVES 


( DONATE BLOOD AND WIN A T-SHIRT ) 


Simple and easy way to save Sets 
give blood, help on Blood Dri 


THANK YOU! 


PAKISTAN 


NEEDS A UNIT 
loon 
IN EVERY 
Ea] SECONDS 
DONATE BLOOD 


jouay: 
—SHIRT 


Fig. 14 (a, b, c & d). Standee and flyer designs 


BE YOUR OWN 


DONATE BLOOD 
SAVE LIVES. 


—& “owe A Smite To Someone,, 
Fig. 15. Billboard Design 
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Give A Smile to 
Someone 


—— re 


BLOOD == 


Day 
14 - 23 JUNE 


DSNAR 


< 


Fig. 16. Facebook Page Layout 


Search Donor Post Request 


Donate Blood 


FINISH 


Fig. 17 Application Splash Screens 
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SIGN UP 


= KAMRAN 
@_yarerignai@gnat com 


@ a 28/ 09) 1905 


6 DONATE BLOOD 
6 FIND DONAR 
© POST REQUEST 
© SEE REQUESTS 
6 BLOOD BANKS 
6 HOSPITALS 
6 > DONAR HISTORY 


@ SUCCESS STORIES 


FIND DONOR 


Muhanad Kamran 
Lahore AB+ 


8 march, 2018 


Muhammad Kamran 
Lahore AB+ 


8 march, 2018 


Muharamad Kamran 


AB+ 
O18 
Muhammad Kamran 
hore AB+ 
8 march, 6 
Muhammad Kamran 
Lahore AB+ 


8 march, 2018 


aay O33HAW CAMMAHUM 


BAIVUA ZFOHAL 


POST REQUEST 


S$ Muhammad Kamran 


Muhammad Kamran 


+92 308 234 8259 


| @| Mayo Hospital, LAHORE 
POST 


Fig. 19. Navigation, find donor, post request screens 
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€ Location 


PERSONAL DETAIL 


Mayo H 
Start Blood Drive 


Fig. 20. See requests, donor profile, location screens 


¢ MUHAMMAD KAMRAN 
Verity Mobile Number HOSPITALS 
Blood Banks 
{ 2 § 2 
. v 
Re-Send } sangaram Hospita : 


sangaram Hospita 
CONFIRM ; : ® 
eupene shore 


° — | =e 
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Fig. 21. Code verification, message, hospital screens 
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Fig. 22. Final products 
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